﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="CardManage.aspx.cs" Inherits="MZ.Money.CardManage" %>
<%@ Register src="../UserControl/Money/TopMenu.ascx" tagname="TopMenu" tagprefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>账户管理</title>
    <link href="../css/reset-min.css" rel="stylesheet" type="text/css" />
    <link href="../css/base-min.css" rel="stylesheet" type="text/css" />
    <link href="../css/main.css" rel="stylesheet" type="text/css" />
    <link href="../css/smoothness/jquery-ui-1.8.14.custom.css" rel="stylesheet" type="text/css" />
    <link href="../css/smoothness/datatables-jui.css" rel="stylesheet" type="text/css" />
    <link href="../css/Money.css" rel="stylesheet" type="text/css" />
    <script src="../js/jquery-1.6.2.min.js" type="text/javascript"></script>
    <script src="../js/jquery-ui-1.8.14.custom.min.js" type="text/javascript"></script>
    <script src="../js/jquery.price_format.1.5.js" type="text/javascript"></script>

    
    <script src="../js/jquery.dataTables1.8.1.min.js" type="text/javascript"></script>
    <script src="../js/mz_ajax.js" type="text/javascript"></script>

    <style>
        #toolbar
        {
            padding: 10px 4px;
        }
    </style>
    
</head>
<body>
    <div style="width: 960px; margin: 0px auto;">
        <form id="form1" runat="server">
       <uc1:TopMenu ID="TopMenu1" runat="server" />
        
        <div id="toolbar" class="ui-widget-header ui-corner-all"  style="margin: 10px 0 10px 0;">
            <button id="btnShowAccount">创建资金账号</button>  
        </div>
        <asp:Repeater runat="server" ID="CardGrid">
            <HeaderTemplate>
                <table id="cardGrid" style="width:100%">
                    <thead>
                        <tr><th style="width:135px">操作</th><th>账户名称</th><th>账户余额</th><th style="width:100px;">账户类型</th><th>开户机构</th><th>账户说明</th></tr>
                    </thead>
                    <tbody>
            </HeaderTemplate>
            <ItemTemplate>
                <tr cid="<%#Eval("CID")%>">
                    <td><button class="JEdit" style="font-size:12px;">编辑</button>&nbsp;<button class="JDel" style="font-size:12px;">删除</button></td>
                    <td><%#Eval("Title")%></td>
                    <td><%#Eval("Money")%></td>
                    <td><%#BLL.Util.EnumHelper.GetEnumDisplay( Eval("Type") as Enum)%></td>
                    <td><%#GetOrganizationTag(Eval("OrganizationID"))%></td>                    
                    <td><%#Eval("Description")%></td>
                </tr>
            </ItemTemplate>
            <FooterTemplate>
               </tbody>
                </table>
            </FooterTemplate>
        </asp:Repeater>
        
        <div id="cardPanel">
            <div class="row_item">
                <label>账户类型</label> <asp:DropDownList runat="server" ID="DdlCardType" DataTextField="Key" DataValueField="Value"></asp:DropDownList>
            </div>
            <div class="row_item">
                <label>账户名称</label> <asp:TextBox runat="server" ID="TxtCardName"></asp:TextBox>
            </div>
            <div class="row_item">
                <label>开户银行</label> <asp:DropDownList runat="server" ID="DdlBank" DataTextField="Title" DataValueField="ID"></asp:DropDownList>
            </div>
            <div class="row_item">
                <label>卡　　号</label> <asp:TextBox runat="server" ID="TxtCardNo"></asp:TextBox>
            </div>
            <div class="row_item">
                <label>信用额度</label> <asp:TextBox runat="server" ID="TxtCredit"></asp:TextBox>
            </div>            
            <div class="row_item">
                <label>初始资金</label> <asp:TextBox runat="server" ID="TxtCardMoney"></asp:TextBox>
            </div>
            <div class="row_item">
                <label>账单日期</label> <asp:TextBox runat="server" ID="TxtBillDate" CssClass="JDate"></asp:TextBox>
            </div>      
            <div class="row_item">
                <label>还款日期</label> <asp:TextBox runat="server" ID="TxtDueDate" CssClass="JDate"></asp:TextBox>
            </div>
            <div style="margin-top:8px">
                <label style=" vertical-align:top">说　　明</label> <asp:TextBox runat="server" ID="TxtDescription" TextMode="MultiLine"></asp:TextBox>
            </div>
            <asp:Button runat="server" ID="BtnCreadCard" Text="创建账户" style="margin-top:10px;" onclick="BtnCreadCard_Click" />
            <asp:Button runat="server" ID="BtnEditCard" Text="编辑账户" style="margin-top:10px;" onclick="BtnEditCard_Click" />
            <asp:HiddenField runat="server" ID="HfieldCID" />
        </div>
        </form>
    </div>
    <div id="dialog-message" title="警告">
	    <p>
		    <span class="ui-icon ui-icon-alert" style="float:left; margin:0 7px 0 0;"></span>
		    你确定要删除嘛？
	    </p>
	    <p>删除后账户内的资金将被清空</p>
    </div>
    
</body>
</html>


<script>
    var cardControlSet = function(card){
            var _isEdit = undefined!=card.CID;
            if(_isEdit){
                $('#DdlCardType').val(card.Type);
                $('#TxtCardName').val(card.Title);
                $('#DdlBank').val(card.OrganizationID);
                $('#TxtCardNo').val(card.CardNumber);
                $('#TxtCredit').val(card.CreditLine);
                $('#TxtCardMoney').val(card.Money);
                $('#TxtBillDate').val(_ajax.parseDate(card.BillDate));
                $('#TxtDueDate').val(_ajax.parseDate(card.DueDate));
                $('#TxtDescription').val(card.Description);
                $('#HfieldCID').val(card.CID);
            }
	        $('#cardPanel .row_item').show();
	        switch($('#DdlCardType').val()){
	            case "3"://股票账号
	                if(!_isEdit){
	                    $('#TxtCardName').val('我的股票账户');
	                }
	                $('#cardPanel .row_item').each(function(index,item){
	                    var ary = [2,3,4,6,7];
	                    if($.inArray(index,ary)!=-1){
	                        $(item).hide();
	                    }
	                });
                break;
	            case "1"://现金
	                if(!_isEdit){
	                    $('#TxtCardName').val('我的现金账户');
                    }
	                $('#cardPanel .row_item').each(function(index,item){
	                    var ary = [2,3,4,6,7];
	                    if($.inArray(index,ary)!=-1){
	                        $(item).hide();
	                    }
	                });
	            break;
	            case "2"://信用卡
	                if(!_isEdit){
	                    $('#TxtCardName').val('我的信用卡账户');
                    }
	                $('#cardPanel .row_item').each(function(index,item){
	                    var ary = [5];
	                    if($.inArray(index,ary)!=-1){
	                        $(item).hide();
	                    }
	                });
	            break;
	            case "4"://借记卡
	                if(!_isEdit){
	                    $('#TxtCardName').val('我的借记卡账户');
	                }
	                $('#cardPanel .row_item').each(function(index,item){
	                    var ary = [4,6,7];
	                    if($.inArray(index,ary)!=-1){
	                        $(item).hide();
	                    }
	                });
	            break;
	        }
	    }

	$(function() {
	    var current_cardTR ;//当前账户ID TR元素
	
	    //初始化账号创建控件显示
	    $('#TxtCardName').val('我的现金账户');
	    $('#cardPanel .row_item').each(function(index,item){
	                    var ary = [2,3,4,6,7];
	                    if($.inArray(index,ary)!=-1){
	                        $(item).hide();
	                    }
	                });
	    //event
	    $('#DdlCardType').change(cardControlSet);
		
		$('.JEdit').click(function(){
		    current_cardTR = $(this).parents("tr");
		    _ajax.post('../server/CardHandler.ashx',{code:'edit',cid:$(current_cardTR).attr('cid')},function(cardJson){
		        $('#BtnEditCard').show();
		        $('#BtnCreadCard').hide();
		        $( "#cardPanel" ).dialog( "option", "title", '编辑账户');
		        $('#cardPanel').dialog("open");
		        cardControlSet(cardJson);
		    })
		    return false;
		})
		$('.JDel').click(function(){
		    $( "#dialog-message").dialog("open");
		    current_cardTR = $(this).parents("tr");
		    return false;
		})
		//toolbar
		$('#btnShowAccount').button().click(function(){
		    $('#BtnEditCard').hide();
		    $('#BtnCreadCard').show();
		    $('#cardPanel').dialog('open');
		    $( "#cardPanel" ).dialog( "option", "title", '创建账户');
		    return false;   
		});
		
		//button
		$('.JEdit').button({icons:{primary:'ui-icon-pencil'}});
	    $('.JDel').button({icons:{primary:'ui-icon-close'}});
		
		//dialog
		$('#cardPanel').dialog({ autoOpen: false,modal: true,title:'创建账户'})
		$('#cardPanel').parent().appendTo($("form:first")); 
		$('#BtnCreadCard,#BtnEditCard').button();
		$( "#dialog-message").dialog({
		    height:180,
		    width:220,
		    autoOpen: false,
			modal: true,
			buttons: {
				'确认': function() {
					$(this).dialog("close");
					_ajax.post('../server/CardHandler.ashx',{code:'delete',cid:$(current_cardTR).attr('cid')},function(data){	
		                if(data == "True"){
		                    $(current_cardTR).remove();
		                }else{
		                    alert('程序异常！');
		                }		                
		            })
				},
				'取消':function(){
				    $(this).dialog("close");
				}
			}
		});
			
		
		//price input
		$('#TxtCardMoney,#TxtCredit').priceFormat({
		     prefix: 'RMB￥',
		     clearPrefix: true
		});
		
		//Table
		$('#cardGrid').dataTable({
		    "bJQueryUI": true,
		    "sPaginationType": "full_numbers"
	    });
	    
	    //datepicker
		$( ".JDate" ).datepicker({
			showOn: "button",
			buttonImage: "../img/Calendar-Edit.png",
			buttonImageOnly: true
		});
	});
</script>